body {
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	height: 100vh;
}

#challenge9 .pendulo {
	position: relative;
	display: flex;
	box-sizing: border-box;
	border-top: 5px solid #b00087;
	width: 30%;
	justify-content: center;
	overflow: hidden;
}

#challenge9 .corda-pendulo {
	position: relative;
	width: 5px;
	height: 120px;
	background: #b00087;
	margin: 0 0.75rem;
}

#challenge9 .corda-pendulo span {
	position: absolute;
	width: 30px;
	height: 30px;
	background: #b00087;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 50%;
	bottom: 0;
}

#challenge9 .corda-pendulo:nth-child(1) {
	animation: pendulo1 2s linear infinite;
}
#challenge9 div.corda-pendulo:last-child{
	animation: pendulo4 2s linear infinite 1s;
}

@keyframes pendulo1 {
	0% {
		transform: rotate(0deg) translateX(0);
	}
	5% {
		transform: rotate(5deg) translateX(-5px);
	}
	10% {
		transform: rotate(10deg) translateX(-10px);
	}
	15% {
		transform: rotate(15deg) translateX(-15px);
	}
	20% {
		transform: rotate(20deg) translateX(-20px);
	}
	25% {
		transform: rotate(25deg) translateX(-25px);
	}
	30% {
		transform: rotate(20deg) translateX(-20px);
	}
	35% {
		transform: rotate(15deg) translateX(-15px);
	}
	40% {
		transform: rotate(10deg) translateX(-10px);
	}
	45% {
		transform: rotate(5deg) translateX(-5px);
	}
	50% {
		transform: rotate(0deg) translateX(0px);
	}
	60%, 100% {
		transform: rotate(0deg) translateX(0px);
	}
}

@keyframes pendulo4 {
	0% {
		transform: rotate(0deg) translateX(0);
	}
	5% {
		transform: rotate(-5deg) translateX(5px);
	}
	10% {
		transform: rotate(-10deg) translateX(10px);
	}
	15% {
		transform: rotate(-15deg) translateX(15px);
	}
	20% {
		transform: rotate(-20deg) translateX(20px);
	}
	25% {
		transform: rotate(-25deg) translateX(25px);
	}
	30% {
		transform: rotate(-20deg) translateX(20px);
	}
	35% {
		transform: rotate(-15deg) translateX(15px);
	}
	40% {
		transform: rotate(-10deg) translateX(10px);
	}
	45% {
		transform: rotate(-5deg) translateX(5px);
	}
	50% {
		transform: rotate(0deg) translateX(0px);
	}
	60%, 100% {
		transform: rotate(0deg) translateX(0px);
	}
}